<template>
  <view class="page">
    <Header :title="'思维导图'"></Header>
    <view class="main_container">
      <view class="main_content">
        <Breadcrumb :text="'个人评测-思维导图-连连看'"> </Breadcrumb>
        <view class="content">
          <XiaoXiaoLe
            v-if="wordList.length > 0"
            ref="xiaoxiaole"
            :wordList="wordList"
            @init="init"
          ></XiaoXiaoLe>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { testWord } from "@/api/mindMap";
export default {
  components: {},
  beforeRouteLeave(to, from, next) {
    this.$refs.xiaoxiaole.stopAudio();
    next();
  },
  onLoad(option) {
    this.chapterId = option.chapterId;
    this.init();
  },
  data() {
    return {
      chapterId: "",
      wordList: [],
    };
  },
  methods: {
    init() {
      let params = {
        id: this.chapterId,
      };
      testWord(params).then((res) => {
        this.wordList = res.data;
      });
    },
  },
};
</script>
<style scoped lang="scss">
@import "./mindMapXiaoXiaoLe";
</style>
